// 菜单

import { defineStore } from 'pinia'
import { ref,reactive } from 'vue'
import { getMenusApi,addMenuApi,delMenuApi,editMenuApi } from '../api/menusApi'
import { ElMessage } from 'element-plus'

const useMenusStore = defineStore('menus', () => {
  // 声明响应式数据
  const menuData = reactive({
    list: []
  })
  // 对话框
  const dialogVisible = ref(false)
  function closeDialog() {
    dialogVisible.value = false
  }
  function openDialog() {
    dialogVisible.value = true
  }
  // 声明操作数据函数
  const getMenusAction = () => {
    // 获取菜单
    getMenusApi().then(res => {
      // console.log(res,'菜单数据--------')
      if (res.code === 200) {
        menuData.list = res.list
      }
    })
  }
  const addMenuAction = (data) => {
    // 新增
    addMenuApi(data).then(res => {
      // console.log(res,'新增菜单------')
      if(res.code === 200) {
        ElMessage({
          message: '新增成功',
          type: 'success'
        })
        // 重新获取菜单数据
        getMenusAction()
      }
    })
  }
  const delMenuAction = (id) => {
    // 删除
    delMenuApi(id).then(res => {
      // console.log(res,'删除菜单------')
      if(res.code === 200) {
        ElMessage({
          message: '删除成功',
          type: 'success'
        })
        // 重新获取菜单数据
        getMenusAction()
      }
    })
  }
  const editMenuAction = (data) => {
    // 编辑
    editMenuApi(data).then(res => {
      // console.log(res,'编辑菜单------')
      if(res.code === 200) {
        ElMessage({
          message: '编辑成功',
          type: 'success'
        })
        // 重新获取菜单数据
        getMenusAction()
      } else {
        console.log(res.msg)
      }
    })
  }
  // 返回数据、函数
  return { getMenusAction,menuData,dialogVisible,closeDialog,openDialog,addMenuAction,delMenuAction,editMenuAction }
})

export default useMenusStore
